<template>
    <div>
        <Header />
        <div class="resourceWrapper">
            <div class="bannerWrapper">
                <div class="mapNav">
                    <div class="indexContainer">
                        <el-breadcrumb separator-class="el-icon-arrow-right">
                            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
                            <el-breadcrumb-item :to="{ path: '/information' }">最新资讯</el-breadcrumb-item>
                            <el-breadcrumb-item>资讯详情</el-breadcrumb-item>
                        </el-breadcrumb>
                    </div>

                </div>
            </div>
            <div class="indexContainer">
                <div class="detailContent">
                    <div class="detailCircle">
                        <h2 class="detailTitle">{{newInfo.title}}</h2>
                        <div class="detailTip">
                            <span>发布人：{{newInfo.updateUser}}</span>
                            <span>发布时间：{{newInfo.updateTime}}</span>
                        </div>
                        <div class="detailItem" >
                            <p class="itemContent" v-html="newInfo.content"></p>
                        </div>
                        <div class="detailItem detailBorder">
                            <h3>附件下载：</h3>
                            <p v-if="newInfo.url" class="detailFu" @click="handleDown(newInfo.url)">{{ newInfo.url }}</p>
                            <p v-else>暂无</p>
                            
                        </div>

                    </div>
                </div>
            </div>

        </div>
        <Footer />
    </div>
</template>
<script>
import { newDetail } from "@/request/api/index"
import Header from "@/components/home/header/header";
import Footer from "@/components/home/footer/footer";
import {dateFormat} from "@/utils/dateFormat.js"
export default {
    components: {
        Header,
        Footer,
    },
    data() {
        return {
            id: this.$route.query.id,
            newInfo: {},
            loading: true
        }
    },
    created() {
        this.getDetail()
    },
    methods: {
        // 获取详情
        getDetail() {
            let params={
                id:this.id
            }
            newDetail(params).then(res => {
                this.loading = false
                if (res.data.code == 1) {
                    this.newInfo = res.data.data
                    this.newInfo.updateTime=dateFormat(this.newInfo.updateTime)
                    document.querySelector('meta[name="keywords"]').setAttribute('content', res.data.data.title)
                    document.querySelector('meta[name="description"]').setAttribute('content', res.data.data.description)
                    document.title = res.data.data.title
                }
            })
        },
        // 下载
        handleDown(url) {
            window.open(url)
        },
    }
}
</script>
<style lang="less" scoped>
@import "./information.less";
.detailFu{
    color:#409eff;
    text-decoration: underline
}
</style>
